---
title: "Theming"
---

Theming refers to the process of adjusting design elements such as colours, borders and spacing to match your applications' design.

We provide a range of methods for customising the appearance of the grid so that you can create any look that your designer can imagine. From the quick and easy to the most advanced, they are:

1. Select a [Built-in Theme](./themes/) as a starting point.
2. Choose a different [Color Scheme](./theming-colors/#colour-schemes) if required.
3. Use [Theme Parameters](./theming-parameters/) to customise borders, compactness, fonts and more.
4. Use [Theme Parts](./theming-parts/) to change the appearance of components like the icon set and text inputs.
5. [Write your own CSS](./theming-css/) for unlimited control over grid appearance.

The grid is styled using CSS. It ships with built-in styles that can create a range of designs. You can then use CSS to create more advanced customisations.

## Programmatically changing row and cell appearance

Separately from theming, the grid supports using code to customise the appearance of individual columns, headers or cells by using [row styles](./row-styles/), [cell styles](./cell-styles/) or [custom renderers](./components/). Unlike theming, these methods allow you to change the appearance of elements depending on the data that they contain.

## Legacy Themes

Before v33, themes were applied by importing CSS files from our NPM packages, see [Legacy Themes](./theming-v32/) for more information.
